<template>
	<section>
		<!--工具条-->
		<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
			<el-form :inline="true">
				<el-form-item label="请选择">
					<el-radio-group v-model="form.authority" >
						<el-radio label="1">全部（选择后，可查看和编辑全部门店的内容）</el-radio>
						<el-radio label="2">仅本店（选择后，仅可查看和编辑和本角色类型相关的内容）</el-radio>
					</el-radio-group>
				</el-form-item>
			</el-form>
			
		</el-col>

		<!--列表-->
		<el-col>
			<div style="margin-top:20px">
				<el-tree
				:data="getMenuData"
				:props="defaultProps"
				:default-checked-keys="checkedItems"
				show-checkbox
				default-expand-all
				node-key="id"
				ref="tree"
				highlight-current>
				</el-tree>
				<!-- check-strictly = 'true' -->
			</div>
		</el-col>
		<el-col>
			<el-button type="primary" @click="btnAdd" >确定分配</el-button>
			<el-button type="primary" @click="btnRemove" >取消分配</el-button>
		</el-col>
	</section>
</template>

<script>
	import util from '../../common/js/util'
	//import NProgress from 'nprogress'
	import { queryResourceByRoleId,queryResource,roleUpdate } from '../../api/api';

	export default {
		data() {
			return {
				id:null,
				resourceIds: [],
				form: {
					authority: '1',
				},

				getMenuData: [],
				defaultProps: {
					children: 'resources',
					label: 'name'
				},
				checkedItems:[],//默认选中
				resourceIds: [],
				positionId: ''
	 		};
		},
		methods: {
			//获取所有的权限
			getResource() {
				let para = {};
				queryResource(para).then((res) => {
					// console.log(res.body);
					this.getMenuData = res.body;
				});
			},
			//获取点击用户已有的权限(//默认选中状态)
			getResourceByuserId(id) {
				queryResourceByRoleId({positionId: id}).then((res) => {
					for(let i = 0; i<res.body.length; i++){
						if(res.body[i].parentId){
							this.checkedItems.push(res.body[i].id);
						}
					}
					this.form.authority = String(res.body[0].authority);
					// console.log(this.form.authority);
					// console.log(this.checkedItems);
					this.checkedItems;
				});
			},
			//取消分配--返回到权限分配页面
			btnRemove: function() {
				this.$router.push({ path: '/admin/position'});
			},
			//确定分配
			btnAdd: function() {
				console.log(this.$refs.tree.getCheckedKeys(),this.form.authority);
				this.resourceIds = this.$refs.tree.getCheckedKeys();
				this.positionId = this.$route.query.id;
				this.$confirm('确认分配吗？', '提示', {}).then(() => {
					this.addLoading = true;
					let para = {
						resourceIds: this.resourceIds,
						positionId: this.positionId,
						authority: this.form.authority
					};
					roleUpdate(para).then((res) => {
						this.addLoading = false;
						if(res.body == 0){
							this.$message({
								message: '分配失败',
								type: 'success'
							});
						};
						if(res.body == 1){
							this.$message({
								message: '分配成功',
								type: 'success'
							});
						};
						if(res.body == 2){
							this.$message({
								message: '暂无修改',
								type: 'success'
							});
						}
					});
				});
			},
		},
		mounted() {
			this.getResource();
			this.id = this.$route.query.id;	
			console.log(this.id);
			this.getResourceByuserId(this.id);
			//默认选中状态			
			// this.checkedItems = [6,7]
		}
}
	

</script>
<style scoped>
	.el-tree{
		border: none;
	}
</style>
